<template>
	
	<view class="content">
		
		<u-navbar
			title="收货地址"
			@leftClick="leftClick"
			:placeholder="true"
			:fixed="true"
			bgColor="#F8F8F8"
			:autoBack="true"
		>
		</u-navbar>
		
		
		<view class="addr_info">
			
			<view class="addr">
				
				<view class="addr_icon_un_box">
					<!-- 地址图标 -->
					<view class="addr_icon">
						<image src="../../static/img/tuihuo/address.png" class="addr_icon_img"></image>
					</view>
					<view class="addr_UserName">收货人：陈先生</view>
				</view>
				
				<view class="addr_UserPhone">13531013644</view>
			</view>
			
			<view class="addr_detail_info">
				<view class="addr_detail">广东省 广州市 番禺区 汉溪大道东362号粤海广场写字楼38层3807室</view>
			</view>
			
			<!-- 分割线 -->
			<view class="line"></view>
			
			<!-- 交互事件 -->
			<view class="addr_button_box">
				
				<view class="addr_icon_addrName_box">
					<view class="addr_button_select_icon">
						<image class="button_select_icon_img" src="../../static/img/tuihuo/choose.png"></image>
					</view>
					<view class="addr_icon_name">默认地址</view>
				</view>
				
				
				<view class="addr_button_icon_box">
					<!-- 编辑图标 -->
					<view class="addr_eadit_icon_box">
						<image class="eadit_img" src="../../static/img/tuihuo/edita.png"></image>
					</view>
					
					<!-- 删除图标 -->
					<view class="addr_delect_icon_box">
						<image class="delect_img" src="../../static/img/tuihuo/gabg.png"></image>
					</view>
					
				</view>
				
			</view>
		
			
		</view>
		<view class="add_addr_button" @click="gotopage('edit_addr')">添加地址</view>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				
			}
		},
		methods:{
			gotopage(param){
				if(param == 'edit_addr'){
					uni.navigateTo({
						url:'/pages/address/edit_addr'
					})
				}
			},
			leftClick(){
				uni.navigateBack({
					delta:1
				})
			}
		}
	}
</script>

<style>
	page {
		background: #F8F8F8;
	}
	.content{
		width: 100%;
		overflow-x: hidden;
		overflow-y: hidden;
	}
	.addr_info{
		margin-top: 21upx;
		padding: 36upx 24upx 24upx 24upx;
		background-color: #FFFFFF;
		width: 702upx;
		height: 306upx;
		box-sizing: border-box;
		margin-left: 24upx;
	}

	.addr{
		display: flex;
		justify-content: space-between;
	}
	
	.addr_icon_un_box{
		display: flex;
	}
	.addr_icon{
		width: 40upx;
		height: 40upx;
	}
	
	.addr_icon_img{
		width: 40upx;
		height: 40upx;
	}
	
	.addr_UserName{
		margin-left: 12upx;
		font-size: 28upx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: #333333;
		line-height: 40upx;
	}
	
	.addr_UserPhone{
		font-size: 28upx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: #333333;
		line-height: 40upx;
	}
	
	.addr_detail_info{
		margin: 36upx 0 0 52upx;
		display: flex;
		font-size: 28upx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
		line-height: 40upx;
	}
	
	.line{
		width: 750upx;
		height: 4upx;
		background: #D8D8D8;
		opacity: 0.2;
		position: relative;
		margin: 0 auto;
		margin-top: 24upx;
		right: 23upx;
	}
	
	.addr_button_box{
		display: flex;
		justify-content: space-between;
		margin-top: 24upx;
	}
	
	.addr_icon_addrName_box{
		display: flex;
	}
	.addr_button_select_icon{
		width: 36upx;
		height: 36upx;
	}
	
	.button_select_icon_img{
		width: 36upx;
		height: 36upx;
	}
	
	.addr_icon_name{
		font-size: 28upx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 40upx;
		margin-left: 24upx;
	}
	
	
	.addr_button_icon_box{
		display: flex;
		justify-content: space-between;
		width: 135upx;
	}
	
	.addr_eadit_icon_box{
		width: 40upx;
		height: 40upx;
		
	}
	
	.addr_delect_icon_box{
		width: 40upx;
		height: 40upx;
	}
	
	.eadit_img{
		width: 40upx;
		height: 40upx;
	}
	.delect_img{
		width: 40upx;
		height: 40upx;
	}
	
	
	.add_addr_button{
		width: 702upx;
		/* height: 88upx; */
		background: #58BCFF;
		border-radius: 8upx;
		position: fixed;
		bottom: 100upx;
		left: 22upx;
		text-align: center;
		line-height: 88upx;
		font-size: 32upx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #FFFFFF;
	}
</style>
